<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>07_计算器练习</title>
</head>
<body>
    <input  type="text" placeholder="请输入数字1" id="i1">
    <br>
    <input  type="text"  placeholder="请输入数字2" id="i2">
    <br>
    <button onclick="f1()">加</button>
    <button onclick="f2()">减</button>
    <button onclick="f3()">乘</button>
    <button onclick="f4()">除</button>
     <h2>运算结果:<span id="i3"></span></h2>

    <script>
        function f1(){
            let inputE=document.querySelector('#i1').value;
            console.log(inputE);
            let inputE2=document.querySelector('#i2').value;
            inputE=parseFloat(inputE);
            inputE2=parseFloat(inputE2);
            console.log(inputE2);
            let inputE3=inputE+inputE2;
            console.log(inputE3);
            let span=document.getElementById('i3');
            span.innerHTML=inputE3;
        }
        function f2(){
            let inputE=document.querySelector('#i1').value;
            console.log(inputE);
            let inputE2=document.querySelector('#i2').value;
            console.log(inputE2);
            inputE=parseFloat(inputE);
            inputE2=parseFloat(inputE2);
            let inputE3=inputE-inputE2;
            console.log(inputE3)
            let span=document.getElementById('i3');

            span.innerHTML=inputE3;

        }
        function f3(){
            let inputE=document.querySelector('#i1').value;
            console.log(inputE);
            let inputE2=document.querySelector('#i2').value;
            console.log(inputE2);
            inputE=parseFloat(inputE);
            inputE2=parseFloat(inputE2);
            let inputE3=inputE*inputE2;
            console.log(inputE3)
            let span=document.getElementById('i3');

            span.innerHTML=inputE3;

        }
        function f4(){
            let inputE=document.querySelector('#i1').value;
            console.log(inputE);
            let inputE2=document.querySelector('#i2').value;
            console.log(inputE2);
            inputE=parseFloat(inputE);
            inputE2=parseFloat(inputE2);
            let inputE3=inputE/inputE2;
            console.log(inputE3)
            let span=document.getElementById('i3');

            span.innerHTML=inputE3;

        }

    </script>

</body>
</html>